﻿@model G28BS.Models.GameRoom

@{
    ViewBag.Title = Model.gameRoomName;
    // Create a seerializer to convert objects to json.
    var serializer = new System.Web.Script.Serialization.JavaScriptSerializer();
}

<h2><span data-bind="    text: gameRoomName">Leikur</span> <a href="#" data-bind="    click: changeName, visible: (gameRoomState() == 'Waiting')"> - Breyta nafni</a></h2>
<div id="gameContainer">
    <div id="gameWindow">
        <!-- Load partial view here from Model.game.name -->
        @Html.Partial(Model.game.name)
    </div>
    <div>
        <div id="playersWindow" data-bind="foreach: slots">
            <div class="playerSlot" data-bind="visible: occupied">
                <img class="userImage" " alt="avatar" data-bind="attr: {src: userImage}"/>
                <input type="checkbox" class="ready" data-bind="checked: ready, enable: userProfileID == currentUserID && !ready, click: $root.playerReady" />
                <span class="userName" data-bind="text: userName, css: { currentUser: userProfileID == currentUserID }">JS error!!</span>
            </div>
            <div class="playerSlot empty" data-bind="visible: !occupied, event: {mouseover:onMouseOver, mouseleave: onMouseLeave}">
                Laust pláss
                <ul class="playerMenu" style="display: none;">
                    <li><a href="#" data-bind="click: inviteByUser">Bjóða leikmanni</a></li>
                    <li><a href="#" data-bind="click: inviteByUserId">Bjóða leikmanni(ID)</a></li>
                    <li data-bind="visible: $root.playableCPU"><a href="#" data-bind="click: $root.playComputer">Spila við tölvu</a></li>
                </ul>
            </div>
        </div>
        <div id="gameButtons">
            <button data-bind="enable: hasMinPlayers() && (gameRoomState() == 'Waiting' || gameRoomState() == 'Fixed'), visible: (gameRoomState() == 'Waiting' || gameRoomState() == 'Fixed'), click: startGame">Byrja leik</button>
            <p data-bind="visible: !hasMinPlayers()">Lágmarksfjöldi spilara (<span data-bind="text: minPlayers">?</span>) þarf að gefa til kynna (með því að haka í reitinn) að hann sé tilbúinn.</p>
        </div>
    </div>
</div>

@Html.Partial("Chat", Model)

@section scripts {
    <!--Script references. -->
    @{
        // Setup strings to load correct game.
        string js = Model.game.name + ".js";
        string hub = char.ToLower(Model.game.name[0]).ToString() + Model.game.name.Substring(1) + "Hub";
    }
    <!-- Reference to the Gameroom and Chat implemention. -->
    <script src="~/Javascripts/Chat_Gameroom.js"></script>

    <!-- Reference to game specific javascript. -->
    <script src="~/Javascripts/@js"></script>

    <!-- And the model for communication. -->
    <script src="~/Javascripts/GameRoomViewModel.js"></script>
    <script>
        // Set up variables with the ID of the GameRoom to send only messages to those in the same GameRoom as us
        var group = '@(Model.gameRoomID.ToString())';
        var masterHub = $.connection.@(hub);

        // Setup Knockout to handle data binding for view.
        // Store model and currentUserID as global variables. (Maybe rethink this global setup).
        var gameRoomModel = new gameRoomViewModel(group, masterHub);
        var currentUserID = @ViewData["currentUserID"];

        // Set KO model values from GameRoomModel.
        gameRoomModel.slots(@Html.Raw(serializer.Serialize(Model.slots)));
        // Use raw to avoid double encoding. Knockout handles escaping.
        gameRoomModel.gameRoomName("@Html.Raw(Model.gameRoomName)");
        gameRoomModel.gameRoomState("@Model.state.ToString()");
        gameRoomModel.gameRoomID = @Model.gameRoomID;
        gameRoomModel.currentUserID = @ViewData["currentUserID"];
        gameRoomModel.currentUserName = ("@ViewData["currentUserName"]");
        gameRoomModel.slotNumber = @ViewData["slotNumber"];
        gameRoomModel.hostUserID = @Model.hostUserID;
        gameRoomModel.minPlayers = @Model.game.minPlayers;
        gameRoomModel.playableCPU = @Model.game.playableCPU.ToString().ToLower();

        // Feed group and hub reference to javascripts
        initializeGameRoom(group, masterHub, gameRoomModel, currentUserID);
        initialize@(Model.game.name)(group, masterHub, gameRoomModel, currentUserID);
        
        // Activates knockout.js
        ko.applyBindings(gameRoomModel);
    </script>
}

@section styles {
    @* Load style bundle of game css files *@
    @Styles.Render("~/Content/Games")
}

